<%-- 
    Document   : user
    Created on : Sep 18, 2011, 6:13:05 PM
    Author     : Red Army
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="pageFunc"%>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>User's information</title>
        <link rel="stylesheet" type="text/css" href="css/style.css"/>
        <link rel="stylesheet" type="text/css" href="css/menu.css"/>
        <link rel="stylesheet" type="text/css" href="css/button.css"/>
        <script type="text/javascript">
            function SelectText(id)
            {
                document.getElementById(id).focus();
                document.getElementById(id).select();
            }
            var i = 0;
            window.setInterval(function() {
                document.getElementById("bannerImg").src = "images/banner"+i+".jpg";
                i++;
                if (i==5) i = 0;
            }, 3000);
            function MM_jumpMenu(targ,selObj,restore){ //v3.0
                eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
                if (restore) selObj.selectedIndex=0;
            }
        </script>
    </head>

    <body>
        <div id="container">
            <div id="header">
                <div id="logo">
                    <img src="images/logo_top.gif" width="500" height="62" alt="logo" />
                </div>
                <div id="login">
                    <!-- ######################### User Login Module ######################## -->
                    <pageFunc:set var="user" value="${sessionScope.USER}"/>
                    <pageFunc:if test="${empty user}">
                        <form action="UserController" method="POST">
                            <div id="login">
                                <br/><span class="loginText">Username</span>
                                <input id="txtUsername" onclick="SelectText('txtUsername')" name="txtUsername" type="text" maxlength="20" width="100px"/>
                                <br/><span class="loginText">Password</span>
                                <input id="txtPassword" onclick="SelectText('txtPassword')" name="txtPassword" type="password" maxlength="20" width="100px"/>
                                <br/>
                                <input type="submit" class="inputBtn" value="Login" name="btnAction" />
                                <input type="submit" class="inputBtn" value="Forgot Password ?" name="btnAction" />
                                <input type="submit" class="inputBtn" value="Register" name="btnAction" />
                            </div>
                        </form>
                    </pageFunc:if>   
                    <pageFunc:if test="${not empty user}">
                        <pageFunc:url var="editUser" value="UserController">
                        <pageFunc:param name="btnAction" value="AccountSetting"/>
                    </pageFunc:url>
                    <br/><span class="loginText">
                        <a class="linkLoginText" style="width:40px;" href="${editUser}">Welcome! ${user.getID()}</a>
                    </span>

                    <pageFunc:url var="logout" value="UserController">
                        <pageFunc:param name="btnAction" value="Log Out"/>
                    </pageFunc:url>
                    <a class="linkLoginText" style="width:40px;" href="${logout}">Log Out</a></pageFunc:if>
                </div>
                <!-- *************************** Navigation Menu ********************************* -->

            </div>

            <div id="banner">
                <img src="images/banner2.jpg" name="bannerImg" width="760" height="210" id="bannerImg" />
            </div>
            <div id="menu">
                <ul class="navigation">
                    <li><a href="index.jsp"><em class="home"></em><b>Home</b></a></li>
                    <li><a href="#"><em class="templates"></em><b>News</b></a></li>
                    <li class="current"><a href="user.jsp"><em class="psd"></em><b>User</b></a></li>
                    <li><a href="catalogue.jsp"><em class="tutorials"></em><b>Catalogue</b></a></li>
                    <li><a href="shoppingcart.jsp"><em class="shop"></em><b>Shopping cart</b></a></li>
                    <li><a href="contact.jsp"><em class="contact"></em><b>Contact Us</b></a></li>
                </ul>
            </div>

            <!-- *************************** Registration Content Module ********************************* -->
            <form action="UserController" method="POST">
                <div id="main">
                    <span class="loginText" style="margin-left:10%;width:90%;padding-bottom:30px;font:large bold">
                        ${user.getID()} </span>

                    <pageFunc:if test="${empty user}">
                        <span class="loginText" style="margin-left:10%;width:90%;padding-bottom:30px;font:large bold">
                            Register Your Account </span>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Username</span>
                            <input name="txtNewUsername" type="text" maxlength="50"/> </div>
                        <div><span class="searchText" style="margin-left:10%;width:20%;">Address</span>
                            <input name="txtNewAddress" type="text" maxlength="50" /></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Email</span>
                            <input name="txtNewEmail" type="text" maxlength="50"/></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Phone</span>
                            <input name="txtNewPhone" type="text" maxlength="50" /></div>
                        <span class="loginText" style="margin-left:10%;width:90%;padding:30px 0 30px 0;font:large bold">
                            Set password</span>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:25%;">New password</span>
                            <input name="txtNewPassword" type="password" maxlength="50" /></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:25%;">Confirm new password</span>
                            <input name="txtConfirmPassword" type="password" maxlength="50" /></div>
                        <div style="width:30%;float:right;padding:30px 0 30px 0">
                            <input type="submit" value="Register" name="btnAction" />
                            <button class="rounded"><span>Reset</span></button>
                        </div> 
                    </pageFunc:if>
                    <pageFunc:if test="${not empty user}">
                        <span class="loginText" style="margin-left:10%;width:90%;padding-bottom:30px;font:large bold">
                            Edit your account </span>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Username: </span>${user.getID()}</div>
                        <input type="hidden" name="txtUsername" value="${user.getID()}"/>
                        <div><span class="searchText" style="margin-left:10%;width:20%;">Address</span>
                            <input name="txtNewAddress" type="text" maxlength="50" value="${user.getAddress()}"/></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Email</span>
                            <input name="txtNewEmail" type="text" maxlength="50" value="${user.getEmail()}"/></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:20%;">Phone</span>
                            <input name="txtNewPhone" type="text" maxlength="50" value="${user.getPhone().toString()}"/></div>
                        <span class="loginText" style="margin-left:10%;width:90%;padding:30px 0 30px 0;font:large bold">
                            Change password</span>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:25%;">Current password</span>
                            <input name="txtCurrentPassword" type="password" maxlength="50" /></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:25%;">New password</span>
                            <input name="txtNewPassword" type="password" maxlength="50" /></div>
                        <div class="personal_info">
                            <span class="searchText" style="margin-left:10%;width:25%;">Confirm new password</span>
                            <input name="txtConfirmPassword" type="password" maxlength="50" /></div>
                        <div style="width:30%;float:right;padding:30px 0 30px 0">
                            <input type="submit" value="Update" name="btnAction" />
                            <button class="rounded"><span>Reset</span></button>
                        </div> 
                    </pageFunc:if>
                </div>
            </form>
            <!-- *************************** Footer Module ********************************* -->
            <div id="footer" class="navigation">
                <span style="margin-top:10px">Copyright by QuanTH. All right reserved.</span>
            </div>
        </div>
    </body>
</html>